import { Component, OnInit, OnChanges, Input, SimpleChanges } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { BsModalService }   from 'ngx-bootstrap/modal';
import { BsModalRef }       from 'ngx-bootstrap/modal/modal-options.class';
import { CustomValidators } from './../../share/validators/custom-form.validators';
import { ProductService }   from './../../core/services/product.service';
import { ToasterService }   from '../../share/toastr/toastr.service';
import { cbCfgList }        from './../condition/condition-builder.config';


@Component({
  selector: 'app-modify',
  templateUrl: './modify.html',
  styleUrls: ['./modify.css'],
  providers: [BsModalService]
})
export class ModifyComponent implements OnInit {

  data:            any[];
  productListData: any[] = [];
  form:            FormGroup;
  conditionData:   object;
  formSubmit:boolean =     false;
  active: boolean    =     false;
  ModifyData: any[]  =     [];
  temp: any;

  @Input('productList') ProductData: any[] = [];

  constructor (
    private formBuilder:    FormBuilder,
    private productService: ProductService,
    public  bsModalRef:     BsModalRef,
    public  toastrService:  ToasterService
  ) { }

  ngOnInit () {
    this.initForm();
  }

  public showConfirmationModal(data: any): void {
        this.productListData = data;
        console.log('--- product list data ---', this.productListData);
        for (let i = 0; this.productListData.length; i++) {
          if (this.productListData[i]['checked'] == true) {
            this.temp = this.productListData[i].asin;
          }
        }
    }


  initForm() {
    const asin = '';
    this.form  = this.formBuilder.group({
      asin: ['asin', [Validators.compose([Validators.required, Validators.minLength(10)])]]},
      {validator: this.validtorAsin('asin')}
    );
  }

  onSubmit() {
    const values    = this.form.value;
    const keys      = Object.keys(values);
    this.formSubmit = true;

    this.conditionData = {
      "asin":       values.asin,
      "tags":       [],
      "conditions": []
    }

    if (this.form.valid) {
      this.productService.ModifyCondition(this.conditionData)
          .subscribe(
            success => {
              this.toastrService.successful('modify successfuly ! ');
            },
            errors => {
              this.toastrService.errors('modify failed ! ');
            }
          );
    }
  }

  private validAsin(asins: string) {
    if (!asins) {
      let msg = 'please enter ASIN !';
      console.log(msg);
      return msg;
    } else if (asins.match(/^([A-Z0-9]{10})(\s*[\s\n,]\s*([A-Z0-9]{10}))*\s*$/) === null) {
      let msg = 'up to 10 ASINs can be imported at one time !';
      console.log(msg);
      return msg;
    }
  }

  validtorAsin(asins: string) {
    return (group: FormGroup): {[key: string]: any} => {
      const asin_amazon = group.controls[asins];
      if (!asin_amazon) {
        return {
          // msg: 'please enter ASIN !'
          ASINError: true
        }
      } 
    //   else if (asin_amazon.value.match(/^([A-Z0-9]{10})(\s*[\s\n,]\s*([A-Z0-9]{10}))*\s*$/) === null) {
    //     return {
    //       // msg: 'ASIN format is incorrect !'
    //       ASINError: true
    //     }
    //   }
    }
  }

}
